require('../fonts/iconfont.css');
require("../css/badge.less")
console.log("badge.js");
document.ready(function () {
    window.utils.isLogin();
    // 取出本地存储当前登录用户的id
    const userId = window.localStorage.getItem('userId')
    /* 获取dom */
    const rankNum = document.querySelector('#rankNum') // 排名
    function getRankRum() {
        window.$http.get(`headPageInfo?userId=${userId}`, function (res) {
            if (res.status === 0) {
                //  取出后端返回的数据
                const rank = res.data.rank // 排名
                // 渲染
                rankNum.textContent = rank
            }
        })
    }
    getRankRum()

    //返回
    const back = document.querySelector(".icon-back");
    back.addEventListener("click", function () {
        if (showBadge.style.display == 'block') {
            window.location.reload()
        } else {
            window.location.href = './mine.html'
        }

    })

    //蒙层
    const badge1 = document.querySelector(".badge1");
    const badge2 = document.querySelector(".badge2");
    const badge3 = document.querySelector(".badge3");
    const badge4 = document.querySelector(".badge4");
    const badge5 = document.querySelector(".badge5");
    const badge6 = document.querySelector(".badge6");
    const badge7 = document.querySelector(".badge7");
    const badge8 = document.querySelector(".badge8");
    const showBadge = document.querySelector("#showBadge");
    const badgeMy = document.querySelector("#badgeMy")
    badge1.addEventListener('click', function () {
        showBadge.style.display = 'block'
        badgeMy.src = require('../img/getbadge01.jpg')
    })
    badge2.addEventListener("click", function () {
        showBadge.style.display = 'block'
        badgeMy.src = require('../img/mybadge02.jpg')
    })
    badge3.addEventListener("click", function () {
        showBadge.style.display = 'block'
        badgeMy.src = require('../img/mybadge03.jpg')
    })
    badge4.addEventListener("click", function () {
        showBadge.style.display = 'block'
        badgeMy.src = require('../img/mybadge04.jpg')
    })
    badge5.addEventListener("click", function () {
        showBadge.style.display = 'block'
        badgeMy.src = require('../img/mybadge05.jpg')
    })
    badge6.addEventListener("click", function () {
        showBadge.style.display = 'block'
        badgeMy.src = require('../img/mybadge06.jpg')
    })
    badge7.addEventListener("click", function () {
        showBadge.style.display = 'block'
        badgeMy.src = require('../img/mybadge07.jpg')
    })
    badge8.addEventListener("click", function () {
        showBadge.style.display = 'block'
        badgeMy.src = require('../img/mybadge08.jpg')
    })
})